<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>


<!-- 
同步异步
在浏览器每打开一个页面，都相当于开辟一个进程。一个进程里面包括多个线程
浏览器多线程。每遇到一个linK就分配一个线程去加载link资源。等吗？不等。代码继续执行。相当于同时做多件事，浏览器中的异步。本质是浏览器多线程。
浏览器加载js，只提供一个线程。所以js单线程.同一个时间内只能干一件事
但是js也模拟出异步操作 ----》主任务队列和等待任务队列
js代码遇到定时器，把定时器放在等待任务队列暂不执行。继续执行主队列任务。
当主任务队列完成，js线程空闲下来，去执行等待任务队列。如果定时器到时间，就把定时器拿到主任务队列执行。如果定时器没到时间，接着等待。
言外之意：当主任务队列代码没执行完，等待队列里定时器到了时间也不会执行。本质js单线程。
ajax异步 
ajax发送请求从send()才开始。同步异步都在执行send之后再说。
onreadystatechange监听readystate状态值改变事件。
-->

<body>
    <script>


        // let xhr = new XMLHttpRequest();
        // xhr.open('GET', '笔记.MD', false);
        // console.log(xhr.readyState)
        // xhr.send();//=>开始请求(状态不为4，其它是都做不了)
        // //=>事件绑定前状态已经是4了
        // xhr.onreadystatechange = () => {
        //     if (xhr.readyState === 2) {
        //         console.log(1);
        //     }
        //     if (xhr.readyState === 4) {
        //         console.log(2);
        //     }
        // };
        // console.log(3);
        let xhr = new XMLHttpRequest()
        xhr.open('GET', '1.json', false)
        xhr.onreadystatechange = () => {
            if (xhr.readyState == 2 && xhr.status == 200) {
                console.log(xhr.getResponseHeader('date'))
            }
            if (xhr.readyState == 4 && xhr.status == 200) {
                console.log(xhr.responseText,typeof xhr.responseText)
            }
        }
        xhr.send(null)
        console.log(3)

    </script>
</body>

</html>